import React, { Component } from 'react'
import { Layout ,Button,Menu} from 'antd';
import IsLogin from '../../util/isLogin'
import request from '../../util/request'
import {Switch,Route,Redirect,NavLink} from 'react-router-dom'
import StudentIndex from './studentIndex'
import TeacherIndex from './teacherIndex'
import Score from './score'
import Student from './student'
import Person from './person'

const { Header, Sider, Content } = Layout;


class Main extends Component {
    state = {
        username:'',
        rolename:'',
        menuList:[]
    }

    componentDidMount(){
        console.log(this.props)
        let username = localStorage.getItem('username');
        let rolename = localStorage.getItem('rolename');
        this.setState({
            username,
            rolename
        })
        //根据不同的身份 请求菜单
        request.get('/api/list').then(res => {
            if(res.code === 1){
                this.setState({
                    menuList:res.data
                })
            }
        })
    }
    
    render() {
        let {username,rolename,menuList} = this.state;
        return (
            <div className="wrap">
                <Layout>
                    <Header>
                        欢迎{username}{rolename},
                        <Button onClick={this.exit}>退出</Button>
                    </Header>
                    <Layout>
                        <Sider className="slider">
                        <Menu theme="dark" mode="inline" defaultSelectedKeys={[this.props.location.pathname]}>
                            {menuList.length && menuList.map((item,index) => <Menu.Item key={'/main'+item.res_router}>
                                <span><NavLink to={'/main'+item.res_router}>{item.res_name}</NavLink></span>
                            </Menu.Item>)}
                        </Menu>
                        </Sider>
                        <Content>
                            <Switch>
                                <Route path="/main/studentIndex" component={StudentIndex}></Route>
                                <Route path="/main/teacher" component={TeacherIndex}></Route>
                                <Route path="/main/score" component={Score}></Route>
                                <Route path="/main/manger" component={Student}></Route>
                                <Route path="/main/person" component={Person}></Route>
                                {/* 判断登录人员的身份：讲师 ===> 讲师首页  学生 ===》 学生首页 */}
                                <Redirect from="/main" to={localStorage.getItem('rolename')==='讲师'?'/main/teacher':'/main/studentIndex'}></Redirect>
                            </Switch>
                        </Content>
                    </Layout>
                </Layout>
            </div>
        )
    }
    //退出
    exit = () => {
        localStorage.clear();
        this.props.history.push('/login');
    }
}

export default IsLogin(Main)
